@charset "utf-8";

* { font-family:\5FAE\8F6F\96C5\9ED1, Arial, Helvetica, sans-serif;}

*,
*:after,
*:before { -webkit-box-sizing: border-box;  -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; margin: 0;}


html, body { background: #000; height: 100%; overflow: hidden; -webkit-overflow-scrolling: none; position: relative;}
a { text-decoration: none;}
body.noEvent { pointer-events: none !important;}

.noCss3 * { -webkit-transition: none !important;}	
body>view { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #999; display: none;}

a.input { position: relative;}
a.input[hover]:after { content: ""; display: block; width: 100%; height: 100%; top: 0; left: 0; overflow: hidden; background: url(../images/btnHover.png) center center no-repeat; background-size: 183px 70px;}

#firstBanner { display: block; background: #222;}
#firstBanner .inner { display: none; background: url(../images/firstBanner.jpg) 0 0 no-repeat; background-size: 100% 100%; width: 576px; height: 100%; position: absolute; left: 50%; top: 0%; margin: 0 0 0 -288px;}
#firstBanner .light { display: block; background: url(../images/carLight.png) 0 0 no-repeat; background-size: 100% 100%; width: 100%; height: 100%; position: absolute; left: 0; top: 0%; z-index: 2; -webkit-transition: opacity 0.3s ease-in-out; opacity: 0;}
#firstBanner a.close { position: absolute; right: 0; top: 50%; width: 45px; height: 45px; margin: -22px 60px 0 0; background: url(../images/iconPlay.png); background-size: 100%; display: block; z-index: 99;}
#firstBanner a.close[hover] { opacity: 0.5;}
#firstBanner .light.on { opacity: 1;}

#beforeGame { background: url(../images/bigBg.jpg) 0 0 no-repeat; background-size: 100% 100%; overflow: hidden;}
#beforeGame #title { position: absolute; left: 0; top: 10px; background: url(../images/title.png) 0 0 no-repeat; background-size: 100% 100%; width: 371px; height: 33px;}
#beforeGame #title h6 { position: absolute; left: 110px; top: 0; width: 100px; height: 33px; line-height: 36px; font-size: 24px; font-weight: normal; background: url(../images/you.png) 0 0 no-repeat; background-size: 50px 33px; padding-left: 56px; display: none;}
#beforeGame #rulesBtn { position: absolute; right: 0; top: 10px; background: url(../images/topGameRules.png) 0 0 no-repeat; background-size: 100% 100%; width: 185px; height: 34px; z-index: 9999; -webkit-transition: all 0.3s ease-out; -webkit-transform: translate(185px, 0);}
#beforeGame #rulesBtn[hover] { opacity: 0.6;}
#beforeGame #rulesBtn.show { -webkit-transform: translate(20px, 0);}

#beforeGame #rules .inner { background: rgba(0,0,0,0.6); width: 80%; height: 70%; left: 10%; top: 18%; position: absolute;}
#beforeGame #rules .inner .title { margin: 20px 0 10px 0; background: url(../images/titleRules.png) center 0 no-repeat; height: 16px; background-size: 110px 16px;}
#beforeGame #rules .inner p { color: #fff; font-size: 13px; padding: 0 20px; line-height: 18px;}
#beforeGame #rules .inner .btns { display: -webkit-box; position: absolute; width: 326px; overflow: hidden; height: 70px; left: 50%; margin-left: -163px; bottom: -40px;}
#beforeGame #rules .inner .btns a.back { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnBack.png); background-size: 100% 100%;}
#beforeGame #rules .inner .btns a.start { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnStart.png); background-size: 100% 100%;}

#beforeGame>view { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; display: none;}
#beforeGame #menu .inner { background: rgba(0,0,0,0.6); width: 80%; height: 70%; left: 10%; top: 18%; position: absolute; -webkit-transition: all 0.3s ease-in-out;}
#beforeGame #menu .inner a { display: block; width: 188px; height: 70px; background: url(../images/btnEvent.png) 0 0 no-repeat; background-size: 100% 100%; position: absolute; left: 50%; top: 50%; margin: -35px 0 0 -94px; -webkit-transform: translate(-0, 10px); -webkit-transition: all 0.2s ease-in-out; opacity: 0;}
#beforeGame #menu .inner a.brand { margin-top: -100px; background: url(../images/btnBrand.png) 0 0 no-repeat; background-size: 100% 100%;}
#beforeGame #menu .inner a.enter { margin-top: 30px; background: url(../images/btnEnterGame.png) 0 0 no-repeat; background-size: 100% 100%;}

#beforeGame #menu .inner.animate a { opacity: 1; -webkit-transform: translate(0, 0);}
#beforeGame #menu .inner a:nth-child(1) { -webkit-transition-delay: 0.1s;}
#beforeGame #menu .inner a:nth-child(2) { -webkit-transition-delay: 0.2s;}
#beforeGame #menu .inner a:nth-child(3) { -webkit-transition-delay: 0.3s;}

#beforeGame #login .inner { background: rgba(0,0,0,0.6); width: 80%; height: 70%; left: 10%; top: 18%; position: absolute;}
#beforeGame #login .inner>* { -webkit-transform: translate(0, 10px); -webkit-transition: all 0.2s ease-in-out; opacity: 0; z-index: 2;}
#beforeGame #login .inner .name { -webkit-transition-delay: 0.1s; width: 220px; height: 35px; background: #fff; position: absolute; left: 50%; top: 50%; margin: -90px 0 0 -110px; padding: 0 10px; color: #333; font-size: 16px;}
#beforeGame #login .inner .tel { -webkit-transition-delay: 0.2s; width: 220px; height: 35px; background: #fff; position: absolute; left: 50%; top: 50%; margin: -45px 0 0 -110px; padding: 0 10px; color: #333; font-size: 16px;}
#beforeGame #login .inner .city { -webkit-transition-delay: 0.3s; width: 220px; height: 35px; background: #fff; position: absolute; left: 50%; top: 50%; margin: 0px 0 0 -110px; border-radius: 0; padding: 0 10px; color: #333; font-size: 16px; border: 0;}
#beforeGame #login .inner .code { -webkit-transition-delay: 0.4s; width: 220px; height: 35px; position: absolute; left: 50%; top: 50%; margin: 45px 0 0 -110px; z-index: 1;}
#beforeGame #login .inner .code input { width: 100px; height: 35px; padding: 0 10px; background: #fff; font-size: 16px;}
#beforeGame #login .inner .code a { display: block; width: 127px; height: 65px; background: url(../images/btnGetCode.png) 0 0 no-repeat; background-size: 100% 100%; position: absolute; right: -12px; top: -15px;}
#beforeGame #login .inner .code .timeout { display: none; width: 127px; height: 65px; background: rgba(0,0,0,0); text-align: center; color: #fff; font-size: 18px; position: absolute; right: -12px; top: -15px; z-index: 99; line-height: 65px;}
#beforeGame #login .inner .code.sedding a { pointer-events: none; opacity: 0.3;}
#beforeGame #login .inner .code.sedding .timeout { display: block;}

#beforeGame #login .inner .btn { -webkit-transition-delay: 0.5s; position: absolute; left: 50%; bottom: -40px; width: 163px; height: 70px; display: block; background: url(../images/btnLogin.png) 0 0 no-repeat; background-size: 100% 100%; margin-left: -81px; opacity: 1; -webkit-transform: translate(0, 0);}
#beforeGame #login .inner.animate .name { opacity: 1; -webkit-transform: translate(0, 0);}
#beforeGame #login .inner.animate .tel { opacity: 1; -webkit-transform: translate(0, 0);}
#beforeGame #login .inner.animate .city { opacity: 1; -webkit-transform: translate(0, 0);}
#beforeGame #login .inner.animate .code { opacity: 1; -webkit-transform: translate(0, 0);}
#beforeGame #login .inner.animate .btn { opacity: 1; -webkit-transform: translate(0, 0);}

#beforeGame #choose .inner { width: 100%; height: 70%; top: 18%; position: relative; z-index: 2;}
#beforeGame #choose .inner .car { height: 130px; width: 100%; margin-bottom: 15px;}
#beforeGame #choose .inner .car .c { width: 100%; height: 130px; display: -webkit-box;}
#beforeGame #choose .inner .car .c span { display: block; height: 100%; -webkit-box-flex: 1; background: url(../images/A1_2013xiao1.png) center bottom no-repeat; background-size: 219px 121px;}
#beforeGame #choose .inner .car .c span.c1 { background: url(../images/A1_2013xiao2.png) center bottom no-repeat; background-size: 219px 121px;}
#beforeGame #choose .inner .car .c span.c2 { background: url(../images/A1_2013xiao3.png) center bottom no-repeat; background-size: 219px 121px;}
#beforeGame #choose .inner .car .c span.c3 { background: url(../images/A1_2013xiao6.png) center bottom no-repeat; background-size: 219px 121px;}
#beforeGame #choose .inner .car .c span.c4 { background: url(../images/A1_2013xiao4.png) center bottom no-repeat; background-size: 219px 121px;}
#beforeGame #choose .inner .car .c span.c5 { background: url(../images/A1_2013xiao1.png) center bottom no-repeat; background-size: 219px 121px;}
#beforeGame #choose .inner .car .c span.c6 { background: url(../images/A1_2013xiao5.png) center bottom no-repeat; background-size: 219px 121px;}

#beforeGame #choose .inner .scrolls { width: 100%; height: 130px; overflow: hidden; position: absolute; z-index: 99; pointer-events: none;}
#beforeGame #choose .inner .scrolls a.left { pointer-events: auto; width: 40px; height: 50px; background: url(../images/scrollLeft.png) center center no-repeat; background-size: 20px 50px; display: block; position: absolute; left: 50px; top: 50%; margin-top: -25px;}
#beforeGame #choose .inner .scrolls a.right { pointer-events: auto; width: 40px; height: 50px; background: url(../images/scrollRight.png) center center no-repeat; background-size: 20px 50px; display: block; position: absolute; right: 50px; top: 50%; margin-top: -25px;}
#beforeGame #choose .inner .scrolls a.un { pointer-events: none; opacity: 0.5;}

#beforeGame #choose .inner ul.color { display: -webkit-box; height: 45px; width: 100%; -webkit-box-pack: center; margin-bottom: 15px; position: relative;  relative; z-index: 2;}
#beforeGame #choose .inner ul.color li { display: block; width: 45px; background: #ff0; margin: 0 1.5%; opacity: 0; -webkit-transform: translate(15px, 0); -webkit-transition: all 0.3s ease-in-out; background: url(../images/carColors.png) 0 0 no-repeat; background-size: 45px 450px; border-radius: 8px;}
#beforeGame #choose .inner ul.color li.c { box-shadow: 0 0 10px rgba(255,255,125,1);}
#beforeGame #choose .inner .start { width: 163px; height: 70px; display: block; position: absolute; left: 50%; bottom: -40px; margin-left: -81px; opacity: 0; -webkit-transform: translate(0, 20px); -webkit-transition: all 0.2s ease-in-out; background: url(../images/btnStart.png) 0 0 no-repeat; background-size: 100% 100%; relative; z-index: 2;}
#beforeGame #choose .mask { background: url(../images/bgMask.png); background-size: 50px 200px; width: 100%; height: 200px; position: absolute; left: 0; bottom: 0; opacity: 0; -webkit-transition: all 0.2s ease-in-out;}

#beforeGame #choose .inner ul.color li:nth-child(1) { -webkit-transform: translate(-500px, 0); background: url(../images/carColors.png) 0 0 no-repeat; background-size: 45px 450px;}
#beforeGame #choose .inner ul.color li:nth-child(2) { -webkit-transform: translate(-500px, 0); background: url(../images/carColors.png) 0 -50px no-repeat; background-size: 45px 450px;}
#beforeGame #choose .inner ul.color li:nth-child(3) { -webkit-transform: translate(-500px, 0); background: url(../images/carColors.png) 0 -100px no-repeat; background-size: 45px 450px;}
#beforeGame #choose .inner ul.color li:nth-child(4) { -webkit-transform: translate(500px, 0); background: url(../images/carColors.png) 0 -150px no-repeat; background-size: 45px 450px;}
#beforeGame #choose .inner ul.color li:nth-child(5) { -webkit-transform: translate(500px, 0); background: url(../images/carColors.png) 0 -200px no-repeat; background-size: 45px 450px;}
#beforeGame #choose .inner ul.color li:nth-child(6) { -webkit-transform: translate(500px, 0); background: url(../images/carColors.png) 0 -250px no-repeat; background-size: 45px 450px;}

#beforeGame #choose .inner.animate ul.color li { opacity: 1; -webkit-transform: translate(0, 0);}
#beforeGame #choose .inner ul.color li:nth-child(1) { -webkit-transition-delay: 0.1s;}
#beforeGame #choose .inner ul.color li:nth-child(2) { -webkit-transition-delay: 0.05s;}
#beforeGame #choose .inner ul.color li:nth-child(3) { }
#beforeGame #choose .inner ul.color li:nth-child(4) { -webkit-transition-delay: 0.05s;}
#beforeGame #choose .inner ul.color li:nth-child(5) { -webkit-transition-delay: 0.1s;}
#beforeGame #choose .inner ul.color li:nth-child(6) { -webkit-transition-delay: 0.15s;}
#beforeGame #choose .inner.animate .start { opacity: 1; -webkit-transform: translate(0, 0); -webkit-transition-delay: 0.3s;}
#beforeGame #choose .inner.animate ~ .mask { opacity: 0.6;}

#beforeGame #brand .inner { background: rgba(0,0,0,0.6); width: 100%; height: 50%; left: 0; top: 38%; position: absolute;}
#beforeGame #brand .inner .bnr { height: 115px; position: absolute; left: 0; top: -40%; width: 100%; overflow: hidden;}
#beforeGame #brand .inner .bnr .scroll { width: 40px; height: 50px; background: url(../images/scrollLeft.png) center center no-repeat; background-size: 20px 50px; display: block; position: absolute; left: 20px; top: 50%; margin-top: -25px; z-index: 9;}
#beforeGame #brand .inner .bnr .scroll.r { left: auto; right: 20px; background: url(../images/scrollRight.png) center center no-repeat; background-size: 20px 50px;}
#beforeGame #brand .inner .bnr ul { width: 200%; height: 100%; display: -webkit-box; -webkit-transition: all 0.3s ease-out;}
#beforeGame #brand .inner .bnr ul li { -webkit-box-flex: 1; height: 100%;}
#beforeGame #brand .inner .bnr ul li.b1 { background: url(../images/banner1.jpg) center center no-repeat; background-size: auto 100%;}
#beforeGame #brand .inner .bnr ul li.b2 { background: url(../images/banner2.jpg) center center no-repeat; background-size: auto 100%;}
#beforeGame #brand .inner .bnr ul.show1 { -webkit-transform: translate(0, 0);}
#beforeGame #brand .inner .bnr ul.show2 { -webkit-transform: translate(-50%, 0);}

#beforeGame #brand .inner .cars { display: -webkit-box; position: absolute; left: 0; bottom: 30px; height: 110px; width: 150%; -webkit-transition: all 0.2s ease-out; z-index: 2;}
#beforeGame #brand .inner .cars .car { width: 100%; -webkit-box-flex: 1; height: 100%; -webkit-transition: all 0.2s ease-out; position: relative;}
#beforeGame #brand .inner .cars .car span { display: block; width: 100%; height: 100%; -webkit-transform: scale(0.6);}
#beforeGame #brand .inner .cars .car1 strong { background: url(../images/gl.png) center center no-repeat; background-size: 75px 13px; position: absolute; left: 0; bottom: -5px; height: 13px; overflow: hidden; width: 100%;}
#beforeGame #brand .inner .cars .car1 span { background: url(../images/A1_2013xiao5.png) center center no-repeat; background-size: auto 100%;}
#beforeGame #brand .inner .cars .car2 strong { background: url(../images/16mt.png) center center no-repeat; background-size: 75px 13px; position: absolute; left: 0; bottom: -5px; height: 13px; overflow: hidden; width: 100%;}
#beforeGame #brand .inner .cars .car2 span { background: url(../images/A1_2013xiao6.png) center center no-repeat; background-size: auto 100%;}
#beforeGame #brand .inner .cars .car3 strong { background: url(../images/16at.png) center center no-repeat; background-size: 75px 13px; position: absolute; left: 0; bottom: -5px; height: 13px; overflow: hidden; width: 100%;}
#beforeGame #brand .inner .cars .car3 span { background: url(../images/A1_2013xiao3.png) center center no-repeat; background-size: auto 100%;}
#beforeGame #brand .inner .cars.c1 { -webkit-transform: translate(17%, 0);}
#beforeGame #brand .inner .cars.c1 .car1 span { -webkit-transform: scale(0.9);}
#beforeGame #brand .inner .cars.c2 { -webkit-transform: translate(-16%, 0);}
#beforeGame #brand .inner .cars.c2 .car2 span { -webkit-transform: scale(0.9);}
#beforeGame #brand .inner .cars.c3 { -webkit-transform: translate(-50%, 0);}
#beforeGame #brand .inner .cars.c3 .car3 span { -webkit-transform: scale(0.9);}

#beforeGame #brand .inner .btns { display: -webkit-box; position: absolute; width: 163px; overflow: hidden; height: 70px; left: 50%; margin-left: -81px; bottom: -40px;}
#beforeGame #brand .inner .btns a { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnBack.png); background-size: 100% 100%;}

#event { background: #333;}
#event img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block;}

#gameing { overflow: hidden;}
#gameing canvas { width: 100%; height: 100%; position: absolute; left: 50%; top: 0;}
#gameing .counts { position: absolute; left: 0; top: 0; width: 113px; height: 39px; background: url(../images/games/runCount.png); background-size: 100% 100%; z-index: 1; color: #fff; font-size: 24px; line-height: 39px; font-weight: normal; padding-left: 78px;}
#gameing .blurs { opacity: 0; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(../images/games/roadBlur.jpg) #f00; background-size: 100% 100%; z-index: 3; -webkit-transition: all 0.3s ease-out;}
#gameing .blurs.blur { opacity: 1;}
#gameing #cloudCanvas { z-index: 2;}
#gameing .start { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 99; background: rgba(0,0,0,0.5); display: none;}
#gameing .start .btn { width: 150px; height: 150px; background: url(../images/games/start.png) 0 0 no-repeat; background-size: 150px auto; display: block; position: absolute; left: 50%; top: 50%; margin: -75px 0 0 -75px;}
#gameing .start .btn[hover] { background: url(../images/games/start.png) 0 -150px no-repeat; background-size: 150px auto;}
#gameing .start .btn.ready3 { background: url(../images/games/start.png) 0 -300px no-repeat; background-size: 150px auto;}
#gameing .start .btn.ready2 { background: url(../images/games/start.png) 0 -450px no-repeat; background-size: 150px auto;}
#gameing .start .btn.ready1 { background: url(../images/games/start.png) 0 -600px no-repeat; background-size: 150px auto;}

#gameing>.title { position: absolute; left: 0; top: 10px; background: url(../images/title.png) 0 0 no-repeat; background-size: 100% 100%; width: 371px; height: 33px; z-index: 99; -webkit-transform: translate(-400px, 0);}
#gameing>.title.show { -webkit-transition: all 0.3s ease-out; -webkit-transform: translate(0, 0);}
#gameing>.title h6 { position: absolute; left: 110px; top: 0; width: 100px; height: 33px; line-height: 36px; font-size: 24px; font-weight: normal; background: url(../images/you.png) 0 0 no-repeat; background-size: 50px 33px; padding-left: 56px; display: none;}

#gameing .score { display: none; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 99;}
#gameing .score .inner { background: rgba(0,0,0,0.6); width: 80%; height: 70%; left: 10%; top: 18%; position: absolute; -webkit-transition: all 0.3s ease-in-out; z-index: 99;}
#gameing .score .inner .title { margin: 15px 0 10px 20px; height: 22px; line-height: 32px; background: url(../images/games/titleEndGame.png) 0 0 no-repeat; background-size: 100px 22px; color: #fff; padding-left: 100px; font-weight: normal;}

#gameing .score .inner .scrolls { height: 150px; margin: 0 20px 0 20px; position: relative; z-index: 999; display: -webkit-box;}
#gameing .score .inner .scrolls .sl { -webkit-box-flex: 1;}
#gameing .score .inner .scrolls .sl:first-child { margin-right: 20px;}
#gameing .score .inner .scrolls .sl h4,
#gameing .score .inner .scrolls .sl ul li { display: -webkit-box; border-bottom: 1px dashed rgba(255,255,255,0.4);}
#gameing .score .inner .scrolls .sl span { display: block;}
#gameing .score .inner .scrolls .sl span:nth-child(1) { width: 25%; text-indent: 4px;}
#gameing .score .inner .scrolls .sl span:nth-child(2) { width: 43%;}
#gameing .score .inner .scrolls .sl span:nth-child(3) { width: 32%;}
#gameing .score .inner .scrolls .sl h4 span:nth-child(1) { text-indent: 0;}
#gameing .score .inner .scrolls .sl h4 { font-size: 15px; color: #fff; height: 30px; line-height: 30px; overflow: hidden;}
#gameing .score .inner .scrolls .sl ul li { font-size: 13px; color: #fff; height: 24px; line-height: 24px; overflow: hidden;}
#gameing .score .inner .scrolls .sl .ss { height: 120px; overflow: auto; -webkit-overflow-scrolling: touch; position: relative;}
#gameing .score .inner .scrolls .sl:last-child ul { overflow: hidden;}
#gameing .score .inner .scrolls .sl ul li.you span { color: #0edfe7;}

#gameing .score .inner .btns { display: -webkit-box; position: absolute; width: 490px; overflow: hidden; height: 70px; left: 50%; margin-left: -245px; bottom: -40px;}
#gameing .score .inner .btns a { width: 163px; height: 70px; display: block; overflow: hidden;}

#gameing .score .inner .btns a.next { background: url(../images/btnNext.png); background-size: 100% 100%; margin-right: -20px; margin-left: 20px;}
#gameing .score .inner .btns a.share { background: url(../images/btnShare.png); background-size: 100% 100%; margin-right: -20px;}
#gameing .score .inner .btns a.yaoqing { background: url(../images/btnYaoqing.png); background-size: 100% 100%;}

#gameing .chooseCard { display: none; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 99;}
#gameing .chooseCard .inner { background: rgba(0,0,0,0.6); width: 80%; height: 70%; left: 10%; top: 18%; position: absolute; -webkit-transition: all 0.3s ease-in-out; z-index: 99; padding: 0 20px;}
#gameing .chooseCard .inner .title { margin: 15px 0 10px 0; height: 22px; line-height: 32px; background: url(../images/games/titleChooseCard.png) 0 0 no-repeat; background-size: 204px 22px; color: #fff; padding-left: 210px; font-weight: normal;}
#gameing .chooseCard .inner .btns { display: -webkit-box; position: absolute; width: 326px; overflow: hidden; height: 70px; left: 50%; margin-left: -163px; bottom: -40px;}
#gameing .chooseCard .inner .btns a { width: 163px; height: 70px; display: block; overflow: hidden;}
#gameing .chooseCard .inner .cards { height: 150px; width: 100%; position: relative; z-index: 999; display: -webkit-box;}
#gameing .chooseCard .inner .cards .light { height: 10px; display: -webkit-box; width: 100%; position: absolute; left: 0; top: 0; -webkit-box-pack: justify;}
#gameing .chooseCard .inner .cards .light span { display: block; width: 10px; height: 10px; border-radius: 5px; background: #fffb85; box-shadow: 0 0 15px #fffb85;}
#gameing .chooseCard .inner .cards .light:last-child { top: auto; bottom: 0;}
#gameing .chooseCard .inner .cards .c { position: absolute; left: 0; top: 50%; height: 103px; width: 100%; overflow: hidden; display: -webkit-box; margin-top: -42px; -webkit-box-pack: justify;}
#gameing .chooseCard .inner .cards .c span { width: 66px; height: 90px; overflow: hidden; display: block; background: url(../images/poker.png); background-size: 100% 100%;}
#gameing .chooseCard .inner .btns a.back { background: url(../images/btnBack.png); background-size: 100% 100%;}
#gameing .chooseCard .inner .btns a.choose { background: url(../images/btnChooseCard.png); background-size: 100% 100%;}

#gameing .noChouZhong { display: none; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 99;}
#gameing .noChouZhong .inner { background: rgba(0,0,0,0.6); width: 80%; height: 70%; left: 10%; top: 18%; position: absolute; -webkit-transition: all 0.3s ease-in-out; z-index: 99; padding: 0 20px;}
#gameing .noChouZhong .inner .title { margin: 75px 0 10px 0; height: 22px; line-height: 32px; background: url(../images/games/titleNoChouZhong.png) center 0 no-repeat; background-size: 204px 22px; color: #fff; font-weight: normal; font-size: 12px; padding-top: 30px; text-align: center;}
#gameing .noChouZhong .inner .btns { display: -webkit-box; position: absolute; width: 163px; overflow: hidden; height: 70px; left: 50%; margin-left: -81px; bottom: -40px;}
#gameing .noChouZhong .inner .btns a { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnEnter.png); background-size: 100% 100%;}

#gameing .chouZhong { display: none; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 99;}
#gameing .chouZhong .inner { background: rgba(0,0,0,0.6); width: 80%; height: 70%; left: 10%; top: 18%; position: absolute; -webkit-transition: all 0.3s ease-in-out; z-index: 99; padding: 0 20px;}
#gameing .chouZhong .inner .card { background: url(../images/games/50chongzhika.png) center center no-repeat; background-size: 475px 300px; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; -webkit-transition: all 0.3s ease-out;}
#gameing .chouZhong .inner.show .card { opacity: 1;}
#gameing .chouZhong .inner .title { margin: 15px 0 0 0; height: 32px; line-height: 16px; background: url(../images/games/titleGongxi.png) 0 0 no-repeat; background-size: 204px 22px; color: #fff; padding-left: 210px; font-weight: normal; font-size: 12px;}
#gameing .chouZhong .inner .btns { display: -webkit-box; position: absolute; width: 490px; overflow: hidden; height: 70px; left: 50%; margin-left: -245px; bottom: -40px;}
#gameing .chouZhong .inner .btns a { width: 163px; height: 70px; display: block; overflow: hidden;}
#gameing .chouZhong .inner .btns a.enter { background: url(../images/btnEnter.png); background-size: 100% 100%; margin-right: -20px; margin-left: 20px;}
#gameing .chouZhong .inner .btns a.shareTX { background: url(../images/btnShareTX.png); background-size: 100% 100%; margin-right: -20px;}
#gameing .chouZhong .inner .btns a.shareSN { background: url(../images/btnShareSN.png); background-size: 100% 100%;}

#shareNumber { background: url(../images/bigBg.jpg) 0 0 no-repeat; background-size: 100% 100%; display: none;}
#shareNumber .view { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden;}
#shareNumber .rules1 .inner,
#shareNumber .rules2 .inner { background: rgba(0,0,0,0.6); width: 80%; height: 70%; left: 10%; top: 18%; position: absolute;}
#shareNumber .rules1 { display: none;}
#shareNumber .rules2 { display: none;}
#shareNumber>.title { position: absolute; left: 0; top: 10px; background: url(../images/title.png) 0 0 no-repeat; background-size: 100% 100%; width: 371px; height: 33px;}
#shareNumber .rules1 .inner .title { margin: 20px 0 10px 0; background: url(../images/titleYaoqing1.png) center 0 no-repeat; height: 16px; background-size: 125px 16px;}
#shareNumber .rules1 .inner p { color: #fff; font-size: 13px; padding: 0 20px; line-height: 22px;}
#shareNumber .rules1 .inner .btns { display: -webkit-box; position: absolute; width: 326px; overflow: hidden; height: 70px; left: 50%; margin-left: -163px; bottom: -40px;}
#shareNumber .rules1 .inner .btns a.back { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnBack.png); background-size: 100% 100%;}
#shareNumber .rules1 .inner .btns a.share { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnShare.png); background-size: 100% 100%;}

#shareNumber .rules2 .inner .title { margin: 20px 0 10px 0; background: url(../images/titleYaoqing2.png) center 0 no-repeat; height: 16px; background-size: 95px 16px;}
#shareNumber .rules2 .inner p { color: #fff; font-size: 13px; padding: 0 20px; line-height: 22px;}
#shareNumber .rules2 .inner span { position: absolute; left: 0; bottom: 30px; height: 20px; line-height: 20px; color: #fff; font-size: 13px; display: block; text-align: center; width: 100%;}
#shareNumber .rules2 .inner .btns { display: -webkit-box; position: absolute; width: 326px; overflow: hidden; height: 70px; left: 50%; margin-left: -163px; bottom: -40px;}
#shareNumber .rules2 .inner .btns a.back { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnBack.png); background-size: 100% 100%;}
#shareNumber .rules2 .inner .btns a.yaoqing { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnYaoqing.png); background-size: 100% 100%;}

#shareNumber .shareP .inner { background: rgba(0,0,0,0.6); width: 80%; height: 70%; left: 10%; top: 18%; position: absolute;}
#shareNumber .shareP { display: none;}
#shareNumber .shareP .inner .btns { display: -webkit-box; position: absolute; width: 326px; overflow: hidden; height: 70px; left: 50%; margin-left: -163px; bottom: -40px;}
#shareNumber .shareP .inner .btns a.back { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnBack.png); background-size: 100% 100%;}
#shareNumber .shareP .inner .btns a.yaoqing { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnYaoqing.png); background-size: 100% 100%;}
#shareNumber .shareP .inner .btns a.share { width: 163px; height: 70px; display: block; overflow: hidden; background: url(../images/btnShare.png); background-size: 100% 100%;}
#shareNumber .shareP .inner .list { height: 150px; overflow: auto; margin: 0 20px; position: relative;}
#shareNumber .shareP .inner .list li { border-bottom: 1px solid rgba(255,255,255,0.3); height: 30px; line-height: 30px; color: #fff; background: url(../images/numDot1.png) 6px center no-repeat; background-size: 12px 12px; text-indent: 24px;}
#shareNumber .shareP .inner .list li.on { background: url(../images/numDot2.png) 6px center no-repeat rgba(255,255,255,0.1); background-size: 12px 12px;}
#shareNumber .shareP1 .inner .btns a.yaoqing { display: none;}
#shareNumber .shareP2 .inner .btns a.share { display: none;}

#shareNumber .shareP1 .inner .title { margin: 20px 0 10px 0; background: url(../images/titleYaoqing1.png) center 0 no-repeat; height: 16px; background-size: 125px 16px;}
#shareNumber .shareP2 .inner .title { margin: 20px 0 10px 0; background: url(../images/titleYaoqing2.png) center 0 no-repeat; height: 16px; background-size: 95px 16px;}































